.portlet {
  padding: $portlet-padding;
  margin: $portlet-margin;
  border: $portlet-border;
  .portlet-header {
    height: $portlet-header-height;
    padding: $portlet-header-padding;
    font-size: $portlet-header-font-size;
    font-weight: 600;
    line-height: $portlet-header-line-height;
    .app-icon {
      margin-right: 0.08rem;
      vertical-align: middle;
    }
    >span {
      vertical-align: middle;
    }
    .portlet-header-action {
      position: absolute;
      top: $portlet-header-action-top;
      right: $portlet-header-action-right;
      ion-icon {
        font-size: $portlet-header-action-icon-font-size;
        color: $portlet-header-action-icon-color;
      }
    }
  }
  .portlet-content {
    height: 100%;
    font-size: $portlet-font-size;
    line-height: $portlet-line-height;
    .portlet-view-container {
      height: 100%;
    }
  }
  .portlet-header + .portlet-content {
    height: $portlet-content-height;
    padding: $portlet-content-padding;
  }
}
